<template>
	<view class="page page-fill">
		<view class="header">
			<view v-if="userIsLogin">
				<image :src="userInfo.faceImage" class="face"></image>
			</view>
			<view v-else>
				<image src="../../static/icos/108x108.png" class="face"></image>
			</view>

			<view class="info-wapper" v-if="userIsLogin">
				<view class="nickname">
					{{userInfo.nickname}}
				</view>
				<view class="nav-info">
					ID: {{userInfo.id}}
				</view>
			</view>
			<view v-else>
				<navigator url="../registLogin/registLogin">
					<view class="nickname regist-login">
						注册/登录
					</view>
				</navigator>
			</view>

			<view class="set-wapper" v-if="userIsLogin">
				<navigator url="../meInfo/meInfo">
					<image src="../../static/icos/settings.png" class="settings"></image>
				</navigator>
			</view>


		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userIsLogin: false,
				userInfo: {}
			}
		},
		onShow() {
			var me = this
			//用户装填的切换
			// var userInfo = uni.getStorageSync("globalUser")
			// if(userInfo!=null&&userInfo!=undefined&&userInfo!=''){
			// 	me.userIsLogin = true
			// 	me.userInfo = userInfo
			// }else {
			// 	me.userIsLogin = false
			// 	me.userInfo = {}
			// }
			// 使用挂载方法获取用户数据
			var userInfo = me.getGlobalUser("globalUser")
			if (userInfo != null) {
				me.userIsLogin = true
				me.userInfo = userInfo
			} else {
				me.userIsLogin = false
				me.userInfo = {}
			}
		},
		methods: {

		}
	}
</script>

<style scoped>
	.page-fill {
		width: 100%;
		height: 100%;
	}

	/* 头部个人信息 start */
	.header {
		/* #ifdef MP */
		padding: 0upx 30upx 40upx 30upx;
		/* #endif */
		/* #ifndef MP */
		padding: 120upx 30upx 40upx 30upx;
		/* #endif */
		background-color: #ffd655;
		background: url(http://122.152.205.72:88/group1/M00/00/03/CpoxxFwu_1OAYFAIAAAzO_Q1tPg693.png) repeat;

		display: flex;
		flex-direction: row;
		justify-content: flex-start;
	}

	.face {
		width: 120upx;
		height: 120upx;
		border-radius: 50%;
		flex-shrink: 0;
	}

	.info-wapper {
		width: 80%;
		margin-left: 40upx;
		display: flex;
		flex-direction: column;
	}

	.nickname {
		color: #6a5018;
		font-size: 18px;
		font-weight: bold;
	}

	.regist-login {
		margin-left: 60upx;
		margin-top: 30upx;
	}


	.nav-info {
		color: #a38e62;
		font-size: 14px;
		margin-top: 10upx;
	}

	.set-wapper {
		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		width: 15%;
	}

	.settings {
		width: 40upx;
		height: 40upx;
	}

	/* 头部个人信息 end */

	/* 中间的 NEXT 大LOGO start */
	.body {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
	}

	.big-next {
		font-size: 160upx;
		color: #F7F7F7;
	}

	/* 中间的 NEXT 大LOGO end */
</style>
